<template>
   <el-form label-width="120px">
  <el-form-item label="账号：">
      <span v-if="MuchShow==false">{{shopgetinfo.bankNum==null||shopgetinfo.bankNum==""?'无':shopgetinfo.bankNum}}</span>
       <el-input v-model.trim="shopgetinfo.bankNum" style="width: 300px; margin-left: 10px" v-if="MuchShow==true"/>
  </el-form-item>
    <el-form-item label="开户名："  >
      <span v-if="MuchShow==false">{{shopgetinfo.bankName==null||shopgetinfo.bankName==""?'无':shopgetinfo.bankName}}</span>
        <el-input v-model="shopgetinfo.bankName" style="width: 300px; margin-left: 10px" v-if="MuchShow==true"/>
  </el-form-item>
   <el-form-item label="银行类型">
     <span v-if="MuchShow==false">{{shopgetinfo.bankId|bankIDtype}}</span>
             <el-select  v-if="MuchShow==true" style="width: 300px; margin-left: 10px" v-model="shopgetinfo.bankId" placeholder="请选择状态" @change="bankIdchange">
                  <el-option label="工商银行" value="8"></el-option>
                  <el-option label="交通银行" value="9"></el-option>
                  <el-option label="招商银行" value="10"></el-option>
                  <el-option label="民生银行" value="11"></el-option>
                  <el-option label="中信银行" value="12"></el-option>
                  <el-option label="浦发银行" value="13"></el-option>
                  <el-option label="兴业银行" value="14"></el-option>
                  <el-option label="光大银行" value="15"></el-option>
                  <el-option label="广发银行" value="17"></el-option>
                  <el-option label="平安银行" value="18"></el-option>
                  <el-option label="北京银行" value="26"></el-option>
                  <el-option label="华夏银行" value="28"></el-option>
                  <el-option label="农业银行" value="29"></el-option>
                  <el-option label="建设银行" value="30"></el-option>
                  <el-option label="邮政储蓄银行" value="31"></el-option>
                  <el-option label="中国银行" value="32"></el-option>
                </el-select>
      </el-form-item>
   <el-form-item label="账号类型">
     <span v-if="MuchShow==false">{{shopgetinfo.bankType|mchTypeFormatter}}</span>
             <el-select  v-if="MuchShow==true" style="width: 300px; margin-left: 10px" v-model="shopgetinfo.bankType" placeholder="请选择状态" @change="scopeTypechange">
                  <el-option label="对公账号" value="0"></el-option>
                  <el-option label="对私账号" value="1"></el-option>
                </el-select>
      </el-form-item>

    <el-form-item label="交易手续费(%)">
      <span v-if="MuchShow==false">{{shopgetinfo.brokerage==null||shopgetinfo.brokerage==""?'无':shopgetinfo.brokerage}}</span>
        <el-input type="number" v-model.trim="shopgetinfo.brokerage" style="width: 300px; margin-left: 10px" v-if="MuchShow==true"/>
  </el-form-item>
      <!-- <el-form-item>
        <el-button
          :loading="loading"
          type="primary"
          @click.native.prevent="submit"
           v-if="MuchShow==true"
          >修改</el-button
        >
      </el-form-item> -->



   </el-form>
</template>
<script>
import { updateMchShop } from '@/api/sysSetUp'
 export default({
     props: {
      shopgetinfo: {
         type: Object,
    },
      MuchShow:{
      type:Boolean
    }
     },
     data () {
         return {
            loading:false,
          options: [{
          value: '8',
          label: '工商银行'
        }, {
          value: '9',
          label: '交通银行'
        }, {
          value: '10',
          label: '招商银行'
        }, {
          value: '11',
          label: '民生银行'
        }, {
          value: '12',
          label: '中信银行'
        },{
          value: '13',
          label: '浦发银行'
        },{
          value: '14',
          label: '兴业银行'
        },{
          value: '15',
          label: '光大银行'
        },{
          value: '17',
          label: '广发银行'
        },{
          value: '18',
          label: '平安银行'
        },{
          value: '26',
          label: '北京银行'
        },{
          value: '28',
          label: '华夏银行'
        },{
          value: '29',
          label: '农业银行'
        },{
          value: '30',
          label: '建设银行'
        },{
          value: '31',
          label: '邮政储蓄银行'
        },{
          value: '32',
          label: '中国银行'
        }
        
        ],
         }
     },
       filters: {
    mchTypeFormatter (val) {
      if (val == 0) {
        return '对公账号'
      } else if (val == 1) {
        return '对私账号'
      }
    },
    bankIDtype(val){
      if (val == 8) {
        return '工商银行'
      } else if (val == 9) {
        return '交通银行'
      }else if (val == 10) {
        return '招商银行'
      }else if (val == 11) {
        return '民生银行'
      }else if (val == 12) {
        return '中信银行'
      }else if (val == 13) {
        return '浦发银行'
      }else if (val == 14) {
        return '兴业银行'
      }else if (val == 15) {
        return '光大银行'
      }else if (val == 17) {
        return '广发银行'
      }else if (val == 18) {
        return '平安银行'
      }else if (val == 26) {
        return '北京银行'
      }else if (val == 28) {
        return '华夏银行'
      }else if (val == 29) {
        return '农业银行'
      }else if (val == 30) {
        return '建设银行'
      }
      else if (val == 31) {
        return '邮政储蓄银行'
      }else if (val == 32) {
        return '中国银行'
      }
      

    }

    },

     methods: {
       bankIdchange(){
         this.shopgetinfo.bankId=val
       },
       scopeTypechange(val){
          this.shopgetinfo.bankType=val
       },

        submit() {
          var _this=this
      this.loading = true;
      updateMchShop(this.shopgetinfo)
        .then((res) => {
          console.log(res);
          this.loading = false;
           this.$message.success("修改成功");
               _this.$store.dispatch('tagsView/delView', _this.$route).then(({ visitedViews }) => {
                  _this.$router.push({
                    path: '/sysMch/list'
                  })
                })// 关闭当前tab回到列表
        })
        .catch((err) => {
         this.loading = false;
        });
    },

      },


 })

</script>
 <style>
</style>
